<template>
	<view>
		<uni-popup ref="popupRef" type="center" background-color="#fff" :is-mask-click="false">
			<view class="popup-content">
				<view class="popup-header">
					<text class="title">请选择工序</text>
						<view class="bill-info">
							<text>单据编号: {{ currentBillNo }}</text>
							<text>生产订单: {{ currentMoBillNo }}</text>
						</view>
				</view>
		

				<!-- 下拉菜单选择工序 -->
				<view v-if class="process-selector">
					<picker 
						@change="onProcessChange" 
						:value="selectedIndex"
						:range="currentProcesses"
						range-key="displayText"
					>
						<view class="picker">
							{{ selectedIndex >= 0 ? currentProcesses[selectedIndex].displayText : '请选择工序' }}
							<uni-icons type="arrowdown" size="22" color="#999"></uni-icons>
						</view>
					</picker>
				</view>

				<view class="popup-footer">
					<button class="cancel-btn" @click="closePopup">取消</button>
					<button class="confirm-btn" :disabled="selectedIndex < 0" @click="confirmSelection">确定</button>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		
		getProPlanisDetail
	} from '@/utils/api.js';
	export default {
		data() {
			return {
				departName:'',//车间
				visible: false,
				loading: false,
				currentItem: null,
				currentBillNo: '', // 存储单据编号
				trayNo : '',//托号
				currentMoBillNo: '', // 存储生产订单编号
				currentProcesses: [],
				selectedIndex: -1, // 当前选中的工序索引
				selectedProcess: null // 当前选中的工序对象
			}
		},
		methods: {
			open(dataMap) {
				this.currentBillNo = dataMap.billNo;
				this.trayNo = dataMap.trayNo;
				this.visible = true;
				this.$refs.popupRef.open('center');
				this.loading = true;
				this.fetchProcesses(this.currentBillNo); // 传递字符串
			},
			closePopup() {
				this.visible = false;
				this.$refs.popupRef.close();
			},
			// 处理工序选择变化
			onProcessChange(e) {
				this.selectedIndex = e.detail.value;
				this.selectedProcess = this.currentProcesses[this.selectedIndex];
			},
			// 确认选择
			confirmSelection() {
				if (this.selectedIndex >= 0 && this.selectedProcess) {
					this.closePopup();
					if (this.departName === '包装车间' || this.departName === '机加车间'){
						// 携带参数跳转（使用 currentBillNo）
						uni.navigateTo({
							url: `/pages/produce/proplandetail?billNo=${this.currentBillNo}&moBillNo=${this.currentMoBillNo}&operNo=${this.selectedProcess.operNo}&trayNo=${this.trayNo}`
						});
					} else{//毛坯和砂芯的单独整一个页面，为了区分汇报的合格数量(校验不一样)
						// 携带参数跳转（使用 currentBillNo）
						uni.navigateTo({
							url: `/pages/produce/proplanDetailSM?billNo=${this.currentBillNo}&moBillNo=${this.currentMoBillNo}&operNo=${this.selectedProcess.operNo}`
						});
					}
						
				
				}
			},
			// 异步获取工序
			async fetchProcesses(billNoStr) {
				try {
					const response = await getProPlanisDetail({billNo: billNoStr});
					// HTTP状态码和业务状态码
					if (response.statusCode === 200 && response.data?.status === 200) {
						const rawData = response.data.data; // 最内层的 data 对象
						this.currentMoBillNo = rawData.data?.moBillNo || "无"; 
						const dataList = rawData.dataList || [];
						this.departName = dataList[0].departName
						this.currentProcesses = dataList.map(item => ({
							operNo: item.operNo || "未知",
							operName: item.operName || "未知",
							billNo: item.billNo, // 保留单据编号
							// 创建用于显示的文本
							displayText: `${item.operNo} ${item.operName}`
						}));
						
						// 默认选择第一道工序
						if (this.currentProcesses.length > 0) {
							this.selectedIndex = 0;
							this.selectedProcess = this.currentProcesses[0];
						}
					} else {
						// console.error("获取工序数据失败:", response);
						const errMsg = response.data?.msg || `HTTP ${response.statusCode}`;
						uni.showToast({
							title: `获取工序失败: ${errMsg}`,
							icon: 'none'
						});
					}
				} catch (error) {
					console.error("请求异常:", error);
					uni.showToast({
						title: '请求异常: ' + error.message,
						icon: 'none'
					});
				} finally {
					this.loading = false;
				}
			}
		}
	}  
</script>

<style lang="scss" scoped>
	/* 新增弹窗样式 */
	.popup-content {
		width: 80vw;
		padding: 20rpx;
		border-radius: 20rpx;
		background-color: #fff;
	}

	.popup-header {
		text-align: center;
		padding: 20rpx 0;
		border-bottom: 1px solid #eee;
	}

	.title {
		font-size: 18px;
		color: #000000;
		font-weight: bold;
	}
	/* 新增单据信息样式 */
	.bill-info {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 20px;
		color: #000000;
		line-height: 1.6;
		margin-top: 10rpx;
	}
	
	/* 新增下拉菜单样式 */
	.process-selector {
		margin: 30rpx 30rpx;
		border: 1px solid #e5e5e5;
		border-radius: 12rpx;
		padding: 20rpx 30rpx;
		background-color: #f9f9f9;
	}
	.picker {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 20px;
		color: #000000;
	}

	.popup-footer {
		padding: 20rpx 0;
		display: flex;
		justify-content: space-between;
		margin-top: 20rpx;
	}
	
	.confirm-btn, .cancel-btn {
		width: 240rpx;
		height: 100rpx;
		border-radius: 10rpx;
		font-size: 22px;
	}
	
	.confirm-btn {
		background-color: #4CAF50;
		color: white;
	}
	
	.confirm-btn[disabled] {
		background-color: #cccccc;
		color: #666;
		opacity: 0.7;
	}
	
	.cancel-btn {
		background-color: #e25447;
		color: #fff;
	}

</style>